यदि आप एक सामाजिक ऐप बना रहे हैं जहां उपयोगकर्ता चित्र अपलोड कर सकते हैं, तो सामग्री मॉडरेशन आपके डेवलपर्स के लिए सबसे महत्वपूर्ण कार्य होना चाहिए। यदि कोई उपयोगकर्ता आपके प्लेटफ़ॉर्म पर कोई विचलित करने वाली छवि अपलोड करता है, तो यह दूसरों की भावनाओं को आहत कर सकता है या चरम स्थिति में, यह एक कानूनी मुद्दा बन सकता है।
इसलिए आपका सबसे अच्छा दांव आपकी सामग्री नीति का उल्लंघन करने वाली NSFW सामग्री को हटाना या धुंधला करना होना चाहिए। इस ट्यूटोरियल में, हम यह देखने जा रहे हैं कि मशीन लर्निंग एल्गोरिदम का उपयोग करके NSFW छवियों का पता कैसे लगाया जाए और फिर छवि को स्वचालित रूप से धुंधला कर दिया जाए।
यदि आपके पास हजारों या लाखों उपयोगकर्ता हैं, तो प्रत्येक छवि की मैन्युअल रूप से समीक्षा करना और उन्हें हाथ से धुंधला करना संभव नहीं है। इसके लिए बहुत अधिक जनशक्ति और बहुत अधिक धन की आवश्यकता होती है।
यहां तक कि हर दिन एक इंसान के लिए सैकड़ों परेशान करने वाली तस्वीरें देखने से कुछ समय बाद मानसिक बीमारी हो सकती है।
आर्टिफिशियल इंटेलिजेंस और मशीन लर्निंग के युग में, हम अपने लाभ के लिए AI तकनीकों का उपयोग कर सकते हैं। आर्टिफिशियल इंटेलिजेंस का उपयोग करके, हम स्वचालित रूप से NSFW छवियों का पता लगा सकते हैं और उन्हें NSFW स्कोर दे सकते हैं। फिर हम उन्हें उनके NSFW स्कोर के अनुसार प्रोग्रामेटिक रूप से धुंधला कर सकते हैं। इसका मतलब है कि डेवलपर्स का NSFW सामग्री पर पूर्ण नियंत्रण है। अब आपके मन में स्वाभाविक प्रश्न आता है कि हम स्वयं AI मॉडल कैसे बना सकते हैं?
स्पष्ट उत्तर यह है कि आपको इसकी आवश्यकता नहीं है। हम किसी भी सास (सेवा के रूप में सॉफ्टवेयर) से एपीआई का उपयोग कर सकते हैं बशर्ते कि कृत्रिम बुद्धि-आधारित समाधान प्रदान करें। इस लेख में, हम NSFW की पहचान को स्वचालित करने और एक निश्चित NSFW सीमा से ऊपर जाने पर छवि को धुंधला करने के लिए Pixlab API का उपयोग कर रहे हैं।
इस लेख में, हम एक वेब प्रोजेक्ट बनाने जा रहे हैं। इस परियोजना की सहायता से, मैं आपको प्रदर्शित करता हूँ,
ऑनलाइन इमेज के NSFW स्कोर का पता कैसे लगाएं।
स्थानीय छवि के NSFW स्कोर का पता कैसे लगाएं।
किसी छवि को उसके NSFW स्कोर के आधार पर धुंधला कैसे करें।
यह एक लंबा-चौड़ा लेख है और मैं इस लेख के माध्यम से आपको अधिक से अधिक व्यावहारिक अभ्यास देने की कोशिश कर रहा हूं। मेरा मानना है कि आप इस लेख को पढ़ने के बाद अपना खुद का NSFW डिटेक्शन सिस्टम बना सकते हैं। तो कृपया एक कप कॉफी लें और अपना ट्यूटोरियल शुरू करें।
चूंकि मैं इस ट्यूटोरियल में पिक्सलैब एपीआई एंडपॉइंट का उपयोग कर रहा हूं, इसके लिए एपीआई कुंजी प्राप्त करना सुनिश्चित करें।
Pixlab API CORS (क्रॉस-ओरिजिनल रिसोर्स शेयरिंग) सक्षम नहीं है। सुरक्षा मुद्दों से बचने के लिए, हमारा ब्राउज़र हमें क्रॉस-ओरिजिन वेबसाइटों से जुड़ने की अनुमति नहीं देता है। इसलिए हमें CORS प्रतिबंध को बायपास करने के लिए एक प्रॉक्सी सर्वर की आवश्यकता है। सर्वर में CORS प्रतिबंध नहीं हैं।
तो एक Nodejs और Expressjs सर्वर बनाएं और मूल सेटअप करें। हम अपने सभी सर्वर कोड को server.js
फाइल में लिखते हैं।
var express = require("express"); var cors = require("cors"); var fileUpload = require("express-fileupload"); var app = express(); // To parse application/json app.use(express.json()); // Enable cors on all request app.use(cors()); // File upload middleware app.use(fileUpload()); app.listen(5000, () => { console.log("Server is running in port 5000 and cors enable"); });
एक ऑनलाइन छवि का NSFW स्कोर प्राप्त करने के लिए, हम /nsfw
nsfw में एक एक्सप्रेस GET
मार्ग जोड़ते हैं। हम इस तुलना के लिए pexels वेबसाइट से इस NSFW छवि का उपयोग करते हैं।
/nsfw
nsfw रूट के अंदर, हम Pixlab के NSFW API एंडपॉइंट को कॉल करते हैं। इस समापन बिंदु के लिए 2 मापदंडों की आवश्यकता होती है। छवि लिंक और एपीआई कुंजी। जब एपीआई वापस प्रतिक्रिया करता है, तो हम सीधे ग्राहक को प्रतिक्रिया भेजते हैं।
app.get("/nsfw", (req, res) => { axios .get("https://api.pixlab.io/nsfw", { params: { img: "https://images.pexels.com/photos/2495905/pexels-photo-2495905.jpeg", key: process.env.PIXLAB_KEY, }, }) .then((resp) => res.json(resp.data)) .catch((err) => console.log(err)); });
फ़्रंट-एंड के लिए, index.js
नामक एक जावास्क्रिप्ट फ़ाइल के साथ एक index.html
फ़ाइल बनाकर एक नया वेब प्रोजेक्ट बनाएँ। जावास्क्रिप्ट फ़ाइल को HTML फ़ाइल के अंदर लिंक करें। HTML फ़ाइल के अंदर की सामग्री इस तरह दिखती है।
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Pixlab NSFW</title> </head> <body> <script src="./index.js"></script> </body> </html>
अब हमें अपने एनएसएफडब्ल्यू एपीआई कॉल को लागू करने के लिए एक बटन जोड़ने की जरूरत है।
<button id="getscore">Get NSFW Score</button>
अब index.js
फ़ाइल के अंदर, हम getnsfwscore()
फ़ंक्शन बनाते हैं। यह फ़ंक्शन हमें अपने प्रॉक्सी सर्वर के /nsfw
एंडपॉइंट पर कॉल करने देता है।
const getScore= document.getElementById("getscore"); async function getnsfwscore() { try { let response =await fetch("http://localhost:5000/nsfw"); console.log(await response.json()); } catch (error) { throw error; } }
जवाब में, Pixlab NSFW API एक NSFW स्कोर देता है। NSFW स्कोर 0 से 1 के बीच होता है। API की विशिष्ट प्रतिक्रिया इस तरह दिखती है।
{ "score": 0.7187498807907104, "status": 200 }
अब आप इस स्कोर का उपयोग अपलोड की गई छवियों को फ़िल्टर करने के लिए कर सकते हैं।
आप उस छवि का NSFW स्कोर निर्धारित करने के लिए अपनी स्थानीय छवियां भी अपलोड कर सकते हैं। यह 2 चरण की प्रक्रिया है। सबसे पहले, हम इस छवि को Pixlab के ऑनलाइन संग्रहण में अपलोड करते हैं और उस छवि का ऑनलाइन लिंक प्राप्त करते हैं। फिर हम Pixlab द्वारा प्रदान किए गए उस ऑनलाइन छवि URL के साथ पिछले चरण का अनुसरण कर सकते हैं।
अपनी स्थानीय छवि अपलोड करने के लिए, हम Pixlab के स्टोर API का उपयोग करते हैं। हमने अपने एक्सप्रेस प्रॉक्सी सर्वर में एक /upload
रूट बनाया है। छवि अपलोड का समर्थन करने के लिए, हम एक्सप्रेस-फाइलअपलोड प्लगइन का उपयोग करते हैं।
स्टोर एपीआई में एक छवि अपलोड करने के लिए, हम छवि और एपीआई कुंजी के साथ एक POST
अनुरोध करते हैं। हम अपनी क्वेरी बनाने के लिए फॉर्मडाटा ऑब्जेक्ट का उपयोग कर रहे हैं।
app.post("/upload", (req, res) => { try { if (!req.files || Object.keys(req.files).length === 0) { return res.status(400).send("No files were uploaded."); } let image = req.files.image; const form = new FormData(); form.append("file", image.data, image.name); form.append("key", process.env.PIXLAB_KEY); form.submit( { protocol: "https:", host: "api.pixlab.io", path: "/store", method: "POST", headers: { "Content-Type": `multipart/form-data; boundary=${form.getBoundary()}`, }, }, (err, resp) => { if (err) { res.status(503).send("File server is currently unavailable"); } resp.pipe(res); } ); } catch (error) { res.status(500).send(error); } });
उपरोक्त कोड ब्लॉक अनुरोध करता है और फ्रंट एंड को प्रतिक्रिया अग्रेषित करता है।
फ्रंट-एंड में, हम उपयोगकर्ता की स्थानीय छवि प्राप्त करने के लिए एक फ़ाइल इनपुट का उपयोग करते हैं।
<input type="file" id="localImage">
हमारी index.js
फ़ाइल के अंदर, हमने अपने प्रॉक्सी सर्वर पर छवि अपलोड करने के लिए uploadToStore
फ़ंक्शन बनाया है।
async function uploadToStore(image) { const formData = new FormData(); formData.append("image", image); try { let response = await fetch("http://localhost:5000/upload", { method: "POST", body: formData, }); return await response.json(); } catch (error) { throw "Fetch request give some error"; } }
अब हम फ़ाइल इनपुट में किसी भी बदलाव के बारे में सुनते हैं। यदि उपयोगकर्ता कोई छवि चुनता है, तो हम इसे uploadToStore
फ़ंक्शन कहते हैं।
const localImage=document.getElementById("localImage"); localImage.addEventListener("change",async(e)=>{ const files=e.target.files; if (files.length >0){ const file=files[0]; let response= await uploadToStore(file); console.log(response); } })
जवाब में, हमें अपनी स्थानीय छवि का ऑनलाइन छवि URL मिलता है। आप इन URL का उपयोग करके अपने ब्राउज़र में छवि की जांच कर सकते हैं।
{ ssl_link: "https://s3.amazonaws.com/media.pixlab.xyz/24p62f73c9583ec6.jpeg", link: "https://s3.amazonaws.com/media.pixlab.xyz/24p62f73c9583ec6.jpeg", id: "24p62f73c9583ec6.jpeg", status: 200 }
अब इस छवि के NSFW स्कोर की गणना करने के लिए, आप ऑनलाइन छवि के लिए NSFW स्कोर प्राप्त करने के पिछले भाग का अनुसरण कर सकते हैं।
छवियों को उनके NSFW स्कोर के अनुसार फ़िल्टर करने के बाद, हम अनुपयुक्त छवियों को धुंधला कर देते हैं। किसी छवि को धुंधला करने के लिए, हम Pixlab के कलंक API समापन बिंदु का उपयोग करते हैं।
हम पिक्सलैब के ब्लर एपीआई को कॉल करने के लिए अपने प्रॉक्सी सर्वर में एक जीईटी /blur
रूट बनाते हैं। एपीआई एंडपॉइंट के लिए इमेज यूआरएल, ब्लर की त्रिज्या, सिग्मा पैरामीटर और आपकी पिक्सलैब एपीआई कुंजी की आवश्यकता होती है।
app.get("/blur", (req, res) => { axios .get("https://api.pixlab.io/blur", { params: { img: "https://images.pexels.com/photos/2495905/pexels-photo-2495905.jpeg", radius: 50, sigma: 30, key: process.env.PIXLAB_KEY, }, }) .then((resp) => res.json(resp.data)) .catch((err) => console.log(err)); });
आप त्रिज्या और सिग्मा मापदंडों को अलग-अलग करके धुंधलापन प्रक्रिया को संशोधित कर सकते हैं।
फ्रंट-एंड में, हम एक blurImage
फंक्शन बनाते हैं। यह फ़ंक्शन हमारे प्रॉक्सी सर्वर के /blur
समापन बिंदु के लिए एक GET अनुरोध करता है।
async function blurImage(){ try { let response =await fetch("http://localhost:5000/blur"); console.log(await response.json()); } catch (error) { throw error; } }
जवाब में, Pixlab सर्वर आपकी अपलोड की गई छवि का धुंधला संस्करण देता है। आप अपने सामने के छोर में प्रदर्शित करने के लिए धुंधली छवि URL का उपयोग कर सकते हैं।
{ ssl_link: "https://s3.amazonaws.com/media.pixlab.xyz/24p62f74006c5fa1.jpeg", link: "https://s3.amazonaws.com/media.pixlab.xyz/24p62f74006c5fa1.jpeg", id: "24p62f74006c5fa1.jpeg", status: 200 }
आप इस ट्यूटोरियल के लिए कोड नमूने मेरे गिटहब सार में पा सकते हैं। यदि आप इस ट्यूटोरियल को पसंद करते हैं, तो आप मेरे ब्लॉग पर और अधिक रोचक ट्यूटोरियल पढ़ सकते हैं। यदि आपके पास कोई प्रतिक्रिया है, तो आप मुझे ट्विटर पर @hrishikeshpathak के रूप में पा सकते हैं।
हाँ, आप अपनी वेबसाइट पर किसी भी छवि को धुंधला करने के लिए CSS ब्लर फ़िल्टर का उपयोग कर सकते हैं। एक अद्वितीय वर्ग, आईडी, या जावास्क्रिप्ट का उपयोग करके अपने HTML छवि तत्व का चयन करें, और फिर ब्लर फ़िल्टर लागू करें।
filter: blur(4px);
MDN वेबसाइट पर CSS ब्लर फ़िल्टर के बारे में और जानें।
नहीं, मैं केवल प्रदर्शन के लिए इस प्रॉक्सी सर्वर का उपयोग कर रहा हूं। आप इस उद्देश्य के लिए अपने स्वयं के उत्पादन सर्वर का उपयोग कर सकते हैं। मैं ब्राउज़र CORS प्रतिबंध को बायपास करने के लिए प्रॉक्सी सर्वर का उपयोग कर रहा हूं।